<ion-header>
    <ion-navbar>
        <ion-title>
        下拉列表刷型
        </ion-title>
    </ion-navbar>
    </ion-header>
<ion-content>
    <h1>下拉列表刷新</h1>
    <ion-refresher (ionRefresh)="doRefresh($event)"> 
        <ion-refresher-content
            pullingIcon="arrow-dropdown"
            pullingText="下拉刷新"
            refreshingSpinner="circles"
            refreshingText="刷新..."> 
        </ion-refresher-content>
        <ion-refresher-content > 
    </ion-refresher-content>
    </ion-refresher>



    <!--复杂列表，使用到了ion-list、标签-->
    <ion-list>
            <!--将点击的item传递进去-->
            <ion-item (click)="clickItem(item)"  *ngFor="let item of users">
              
              <!--通过ion-avatar 来设置头像,可以将方形的，设置成为圆形的头像-->
              <ion-avatar  item-start>
                  <img src="{{item.img}}">
              </ion-avatar>
              <h2>{{item.name}}</h2>
              <p>{{item.description}}</p>
              <!--表示在列表的后面-->
              <p item-end>{{item.gender?'男':'女'}}, {{year_now - item.age}} 岁</p>
            </ion-item>
          </ion-list>

          
          <!--下滑的时候，加载数据-->
          <ion-infinite-scroll (ionInfinite)="doInfinite($event)"> 
               <ion-infinite-scroll-content
                loadingSpinner="bubbles"
                loadingText="加载中..."> 
                </ion-infinite-scroll-content> 
            </ion-infinite-scroll>
</ion-content>